details summary タグ

かゆいところに手届いてる例

openのアニメーションが一度しか動かない

TODO: 動いてるやつの挙動調べる

あるのか？

iOS14バグ

display:flexが、summaryで効かない

対処

divなどで包む

summary::beforeなどの擬似要素 Pseudo-elementsでoverlayUI作って、non JSでどこクリックしても閉じられるようにしたい。しかし、消せないoutline cssのようなものが表示される

対処

outline:noneにして、outlineをbox-shadowで表現

https://i.gyazo.com/34efd12d346fda851a9dc82d5098ac3d.mp4

トラッキング部分だけJS使ったけど、それ以外は、ios14~で大丈夫なもの作った。